<template>
  <div>
    <!--  -->
    <crumbs @goBack="goBack" :superiorMenu="['设备管理', '设备点巡检']" currentMenu="点巡检方案"></crumbs>
    <a-card :bordered="false" style="height: 100%; margin-top: 12px">
      <a-button @click="handleShowFilter" icon="filter"
        >筛选 <span class="filter-num" style="margin-left: 5px">{{ ' ' + filteredNums }}</span></a-button
      >
      <a-button @click="showColumn" icon="unordered-list" class="btns">设置列</a-button>
      <div class="right-btn">
        <!-- <a-button @click="importFile">导入</a-button>
        <a-button @click="exportFile" class="btns">导出</a-button> -->
        <a-button @click="handleAdd" type="primary" icon="plus" class="btns">新建</a-button>
      </div>
      <a-table
        row-key="id"
        size="middle"
        :scroll="{ x: computedX, y: 'calc(100vh - 366px)' }"
        :columns="columns"
        :dataSource="modelList"
        :row-selection="{ selectedRowKeys: selectedRowKeys, columnTitle: ' ', onChange: onSelectChange }"
        :pagination="false"
        class="j-table-force-nowrap"
        @change="handleChange"
      >
        <span slot="actions" slot-scope="text, record">
          <span>
            <!-- <a-popconfirm
              title="请确定要开始此工单吗?"
              v-if="record.status == 'notStarted'"
              @confirm="confirmStart(record)"
              ok-text="确定"
              cancel-text="取消"
            > -->
            <a href="#">编辑</a>
            <!-- </a-popconfirm> -->
            <!-- <a href="#" @click="overItem(record)" v-if="record.status == 'inProduction'">完成</a> -->
            <a-divider type="vertical" />
            <a-dropdown>
              <a class="ant-dropdown-link">
                更多
                <a-icon type="down" />
              </a>
              <a-menu slot="overlay">
                <a-menu-item>
                  <a-button
                    type="link"
                    v-if="record.status == 'notStarted' || record.status == 'inProduction'"
                    >启用
                  </a-button>
                  <a-button type="link"  v-else>禁用 </a-button>
                </a-menu-item>
                <a-menu-item>
                  <a-button type="link" @click="handleDelete(record)">删除</a-button>
                </a-menu-item>
              </a-menu>
            </a-dropdown>
          </span>
        </span>
        <!-- 行信息 -->
        <span
          slot="inStockStatus"
          :title="
            record.inStockStatus == '1'
              ? '未开始'
              : record.inStockStatus == '2'
              ? '进行中'
              : record.inStockStatus == '3'
              ? '已完成'
              : '-'
          "
          slot-scope="text, record"
          :style="{ color: setColor(record.inStockStatus) }"
        >
          {{
            record.inStockStatus == '1'
              ? '未开始'
              : record.inStockStatus == '2'
              ? '进行中'
              : record.inStockStatus == '3'
              ? '已完成'
              : '-'
          }}
        </span>
        <!-- 入库进度 -->
        <template slot="inboundProgress" slot-scope="text, record">
          <div style="text-align: center">{{ record.completeNum || 0 }}/{{ record.boundNum || 0 }}</div>
          <a-progress
            :percent="(record.completeNum / record.boundNum) * 100"
            :strokeWidth="5"
            :showInfo="false"
            :strokeColor="checkStatus((record.completeNum / record.boundNum) * 100)"
          />
        </template>
        <span
          slot="applyNo"
          :title="record.applyNo"
          slot-scope="text, record"
          class="btn-text"
          @click="handleDetail(record)"
        >
          {{ record.applyNo }}
          <!-- <a href="" @click="handleDetail(record)">详情</a> -->
        </span>
        <!-- 10个字符控制 超出。。。 -->
        <span :title="text" slot="reason" slot-scope="text">
          {{ subStrText(text, 10) }}
        </span>
        <span :title="text" slot="remark" slot-scope="text">
          {{ subStrText(text, 10) }}
        </span>
        <!-- 6个字符控制 超出。。。 -->
        <span :title="text" slot="goodsName" slot-scope="text">
          {{ subStrText(text, 6) }}
        </span>
        <span :title="text" slot="spec" slot-scope="text, record">
          {{ subStrText(text, 6) }}
        </span>
        <span :title="text" slot="basicUnitText" slot-scope="text">
          {{ subStrText(text, 6) }}
        </span>
        <span :title="record.returnerIdText" slot="returnerId" slot-scope="text, record">
          {{ record.returnerIdText }}
        </span>
        <span :title="record.applicantIdText" slot="applicantId" slot-scope="text, record">
          {{ record.applicantIdText }}
        </span>
        <span slot="flowStatusName" slot-scope="text, record" :style="{ color: statusColor(record.flowStatus) }">
          <div>{{ text || '-' }}</div>
        </span>
        <!-- 输入框搜索 -->
        <div slot="searchInput" slot-scope="{ selectedKeys, confirm, clearFilters, column }" class="searchWorkOreder">
          <a-input
            placeholder="请输入"
            v-model="filterForm[column.dataIndex]"
            style="width: 188px; display: block"
            @pressEnter="requestData"
          />
          <a-button
            type="primary"
            style="width: 80px; margin-left: 20px; display: block"
            @click="() => handleSearch(selectedKeys, confirm, column.dataIndex, clearFilters)"
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot="searchIcon"
          slot-scope="filtered"
          type="search"
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
        <!-- 选择搜索 -->
        <div slot="selectDropdown" slot-scope="{ confirm, clearFilters, column }" class="searchWorkOreder">
          <a-select
            mode="multiple"
            :placeholder="checkPlaceholder(column.dataIndex)"
            allowClear
            style="width: 188px"
            v-model="filterForm[column.dataIndex]"
          >
            <a-select-option value="1">未开始</a-select-option>
            <a-select-option value="2">进行中</a-select-option>
            <a-select-option value="3">已完成</a-select-option>
          </a-select>
          <a-button
            type="primary"
            style="width: 80px; margin-left: 20px; display: block"
            @click="() => handleSearch(confirm, column.dataIndex, clearFilters)"
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot="selectIcon"
          slot-scope="filtered"
          type="filter"
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
        <!-- 日期搜索 -->
        <div slot="datePicker" slot-scope="{ confirm, clearFilters, column }" class="searchWorkOreder">
          <a-range-picker
            style="width: 188px"
            :show-time="{ format: 'HH:mm:ss' }"
            v-model="modelEndTime"
            format="YYYY-MM-DD HH:mm:ss"
            :placeholder="['开始时间', '结束时间']"
            @change="endTimeChange"
          />
          <a-button
            type="primary"
            style="width: 80px; margin-left: 20px; display: block"
            @click="() => handleSearch(confirm, column.dataIndex, clearFilters)"
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot="dateIcon"
          slot-scope="filtered"
          type="filter"
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
        <!-- 人员选择 -->
        <div slot="selectPeople" slot-scope="{ confirm, clearFilters, column }" class="searchWorkOreder">
          <j-select-user-by-dep
            @changeRow="userCreate"
            v-model="createStr"
            :seldep="true"
            :modalWidth="1000"
            :limit="5"
            :multi="true"
            v-if="column.dataIndex == 'applicantId'"
          ></j-select-user-by-dep>
          <a-button
            type="primary"
            style="width: 80px; margin-left: 20px; display: block"
            @click="() => handleSearch(confirm, column.dataIndex, clearFilters)"
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot="peopleIcon"
          slot-scope="filtered"
          type="filter"
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
      </a-table>
      <SetColumn
        columnName="设置列"
        ref="SetColumn"
        v-if="showSetColumn"
        @sureBtn="sureBtn"
        @cancelBtn="showSetColumn = false"
      />
    </a-card>
    <a-drawer placement="right" width="500" :visible="showFilter" @close="closeFilter">
      <div class="filter-body">
        <div slot="title" class="uni-card filter-tit">
          筛选 <span class="filter-num">{{ filteredNums }}</span>
        </div>
        <div class="uni-card" v-if="filteredNums > 0" style="background: #fff">
          <div v-for="(item, i) in filteredList" :key="i" v-show="item.text" class="tag-wrap">
            <span class="filter-tag" @click="delFiltered(item.key)">
              <span class="tag-text">{{ `${item.title}：${item.text}` }}</span>
              <a-icon type="close" style="float: right" />
            </span>
          </div>
        </div>
        <div style="overflow-y: scroll; flex: 1; padding: 0">
          <div class="uni-card" style="background: #fff">
            <a-form-model ref="ruleForm" layout="vertical" :model="filterForm">
              <a-form-model-item label="申请编号">
                <a-input v-model="filterForm.applyNo" placeholder="请输入" />
              </a-form-model-item>
              <a-form-model-item label="入库状态">
                <a-select allowClear mode="multiple" placeholder="请选择" v-model="filterForm.inStockStatus">
                  <a-select-option value="1">未开始</a-select-option>
                  <a-select-option value="2">进行中</a-select-option>
                  <a-select-option value="3">已完成</a-select-option>
                </a-select>
              </a-form-model-item>
              <a-form-model-item label="提交人">
                <j-select-user-by-dep
                  @changeRow="createChange"
                  v-model="createStr"
                  :seldep="true"
                  :modalWidth="1000"
                  :limit="5"
                  :multi="true"
                ></j-select-user-by-dep>
              </a-form-model-item>
              <a-form-model-item label="提交时间">
                <a-range-picker
                  date-format="YYYY-MM-DD"
                  :placeholder="['请输入', '请输入']"
                  v-model="modelEndTime"
                  style="width: 100%"
                  @change="endTimeChange"
                />
              </a-form-model-item>
            </a-form-model>
          </div>
        </div>
        <div class="footer-submit">
          <a-button class="margin-btn" @click="resetFilter">重置</a-button>
          <a-button type="primary" @click="handleFilter">确定</a-button>
        </div>
      </div>
    </a-drawer>
    <!-- 全选/分页 -->
    <div
      class="uni-card"
      :style="{ position: 'fixed', bottom: 0, right: 0, left: collapsed ? '79px' : '208px', background: '#fff' }"
    >
      <div style="display: inline-block; margin-left: 25px">
        <a-checkbox :indeterminate="listIndeterminate" :checked="listCheckAll" @change="onCheckAllChange"></a-checkbox>
        <!-- <span class="pubColor" style="margin: 0 24px">批量完成</span><span class="pubColor">批量作废</span> -->
        <span style="margin-left: 8px">
          {{ `已选 ${selectedRowKeys.length}/${total} 项` }}
          <span @click="clearArr" class="pubColor" style="margin: 0 10px">清空</span>
          <span @click="handleDelete(selectedRowKeys)" class="pubColor" style="margin: 0 10px">批量删除</span>
        </span>
      </div>
      <div style="display: inline-block; float: right">
        <a-pagination
          :total="total"
          v-model="current"
          :page-size-options="pageSizeOptions"
          :page-size="pageSize"
          @change="onChangePage"
          @showSizeChange="onShowSizeChange"
          show-quick-jumper
          show-size-changer
        />
      </div>
    </div>
  </div>
</template>
<script>
import SetColumn from '@/pubComponent/SetColumn.vue'
import crumbs from '@/components/crumbs.vue'
import { getNewColumns, subStrText, camelCase2UnderLine } from '@/utils/util'
import { API } from '@/api/requestFzs'
import moment from 'dayjs'
import { mapState } from 'vuex'
import { returnMaterialApplyList, returnMaterialDelete } from '@/api/goodsManagement'
import { getEnableOne } from '@/api/api'

// 表头
const columnsValue = [
  {
    title: '申请编号',
    ellipsis: true,
    dataIndex: 'applyNo',
    width: 180,
    scopedSlots: {
      filterDropdown: 'searchInput',
      filterIcon: 'searchIcon',
      customRender: 'applyNo',
    },
    sorter: true,
  },
  {
    title: '工单编号',
    ellipsis: true,
    dataIndex: 'orderCode',
    width: 180,
    scopedSlots: { customRender: 'orderCode' },
    sorter: true,
  },
  {
    title: '产品编号',
    ellipsis: true,
    dataIndex: 'goodsCode',
    width: 180,
  },
  {
    title: '产品名称',
    ellipsis: true,
    dataIndex: 'goodsName',
    width: 150,
    scopedSlots: { customRender: 'goodsName' },
  },
  {
    title: '规格',
    ellipsis: true,
    dataIndex: 'spec',
    width: 150,
  },
  {
    title: '基本单位',
    width: 100,
    ellipsis: true,
    dataIndex: 'basicUnitText',
  },
  {
    title: '入库进度',
    ellipsis: true,
    align: 'left',
    dataIndex: 'inboundProgress',
    width: 150,
    scopedSlots: { customRender: 'inboundProgress' },
  },
  {
    title: '入库状态',
    ellipsis: true,
    dataIndex: 'inStockStatus',
    width: 150,
    scopedSlots: {
      filterDropdown: 'selectDropdown',
      filterIcon: 'selectIcon',
      customRender: 'inStockStatus',
    },
  },
  {
    title: '审核状态',
    ellipsis: true,
    dataIndex: 'flowStatusName',
    width: 100,
    scopedSlots: { customRender: 'flowStatusName' },
  },

  {
    title: '退料原因',
    align: 'left',
    ellipsis: true,
    width: 150,
    dataIndex: 'reason',
    scopedSlots: { customRender: 'reason' },
  },
  {
    title: '退料人',
    align: 'left',
    width: 150,
    ellipsis: true,
    dataIndex: 'returnerId',
    scopedSlots: { customRender: 'returnerId' },
  },
  //   {
  //     title: '领料人',
  //     ellipsis: true,
  //     dataIndex: 'reciverIdText',
  //     width: 120,
  //   },
  {
    title: '退料时间',
    ellipsis: true,
    dataIndex: 'returnTime',
    width: 180,
  },
  {
    title: '提交人',
    ellipsis: true,
    dataIndex: 'applicantId',
    width: 120,
    scopedSlots: {
      filterDropdown: 'selectPeople',
      filterIcon: 'peopleIcon',
      customRender: 'applicantId',
    },
  },
  {
    title: '提交时间',
    ellipsis: true,
    dataIndex: 'applyTime',
    width: 180,
    sorter: true,
    scopedSlots: {
      filterDropdown: 'datePicker',
      filterIcon: 'dateIcon',
      customRender: 'applyTime',
    },
  },
  {
    title: '备注',
    ellipsis: true,
    dataIndex: 'remark',
    width: 150,
    scopedSlots: {
      customRender: 'remark',
    },
  },
  // {
  //   fixed: 'right',
  //   title: '操作',
  //   align: 'left',
  //   dataIndex: 'actions',
  //   ellipsis: true,
  //   scopedSlots: { customRender: 'actions' },
  // },
]
const actionArr = [
  {
    fixed: 'right',
    title: '操作',
    align: 'left',
    dataIndex: 'actions',
    ellipsis: true,
    scopedSlots: { customRender: 'actions' },
  },
]
export default {
  name: 'returnMaterialList', //退料单列表
  data() {
    return {
      columnsValue,
      modelEndTime: [], //提交时间
      //人员组件 提交人
      createStr: '',
      showCreateStr: '', //提交人
      moment,
      subStrText,
      selectedRowKeys: [],
      showFilter: false, // 筛选抽屉
      modelList: [], // 列表数据
      showSetColumn: false, // 显示
      // 排序
      sortForm: {
        sortType: '',
        sortColumn: '',
      },
      //全选按钮
      listIndeterminate: false,
      listCheckAll: false,
      current: 1,
      total: 0,
      pageSize: 10,
      pageSizeOptions: ['30', '40', '50'],
      columns: [
        {
          title: '申请编号',
          ellipsis: true,
          dataIndex: 'applyNo',
          width: 180,
          scopedSlots: {
            filterDropdown: 'searchInput',
            filterIcon: 'searchIcon',
            customRender: 'applyNo',
          },
          sorter: true,
        },
        {
          title: '工单编号',
          ellipsis: true,
          dataIndex: 'orderCode',
          width: 180,
          scopedSlots: { customRender: 'orderCode' },
          sorter: true,
        },
        {
          title: '产品名称',
          ellipsis: true,
          dataIndex: 'goodsName',
          width: 150,
        },
        {
          title: '入库进度',
          ellipsis: true,
          dataIndex: 'inboundProgress',
          width: 150,
          scopedSlots: { customRender: 'inboundProgress' },
        },
        {
          title: '入库状态',
          ellipsis: true,
          dataIndex: 'inStockStatus',
          align: 'left',
          width: 150,
          scopedSlots: {
            filterDropdown: 'selectDropdown',
            filterIcon: 'selectIcon',
            customRender: 'inStockStatus',
          },
        },
        {
          title: '审核状态',
          ellipsis: true,
          dataIndex: 'flowStatusName',
          width: 100,
          scopedSlots: { customRender: 'flowStatusName' },
        },
        {
          title: '提交人',
          ellipsis: true,
          dataIndex: 'applicantId',
          width: 120,
          scopedSlots: {
            filterDropdown: 'selectPeople',
            filterIcon: 'peopleIcon',
            customRender: 'applicantId',
          },
        },
        {
          title: '提交时间',
          ellipsis: true,
          dataIndex: 'applyTime',
          width: 180,
          sorter: true,
          scopedSlots: {
            filterDropdown: 'datePicker',
            filterIcon: 'dateIcon',
            customRender: 'applyTime',
          },
        },
        {
          fixed: 'right',
          title: '操作',
          align: 'left',
          dataIndex: 'actions',
          ellipsis: true,
          scopedSlots: { customRender: 'actions' },
        },
      ],
      filterForm: {
        applyNo: '', //申请编号
        inStockStatus: undefined, //入库状态
        planEndTime: null, //提交时间
        applicantId: '', //提交人
      },
      filteredFormLable: {
        applyNo: '申请编号',
        inStockStatus: '入库状态', //入库状态
        applicantId: '提交人', //提交人
        planEndTime: '提交时间', //提交时间
      },
      flowStatus: {
        RUNNING: { text: '审批中', color: '#FF943E' },
        REFUSE: { text: '已拒绝', color: '#FF4D4F' },
        CANCELED: { text: '已撤回', color: '#888888' },
        AGREE: { text: '已通过', color: '#00B042' },
        TERMINATED: { text: '已终止', color: '#FF4D4F' },
      },
      userNames: '',
      dateForm: {},
      loginUser: '',
    }
  },
  components: {
    SetColumn,
    crumbs,
  },
  computed: {
    computedX() {
      let xnum = 0
      for (let item of this.columns) {
        xnum += Number(item.width) || 0
      }
      return xnum
    },
    ...mapState({
      collapsed: (state) => state.user.collapsed,
    }),
    filteredList() {
      let list = []
      for (let key in this.filterForm) {
        if (this.filterForm[key] !== '' && this.filteredFormLable[key] == '提交人') {
          list.push({
            title: this.filteredFormLable[key],
            text: this.showCreateStr,
            key,
          })
        } else if (this.filterForm[key] !== undefined && this.filteredFormLable[key] == '入库状态') {
          let param = []
          this.filterForm[key].forEach((item) => {
            if (item == '1') {
              param.push('未开始')
            } else if (item == '2') {
              param.push('进行中')
            } else if (item == '3') {
              param.push('已完成')
            }
          })
          list.push({
            title: this.filteredFormLable[key],
            text: param.join(','),
            key,
          })
        } else {
          list.push({
            title: this.filteredFormLable[key],
            text: this.filterForm[key],
            key,
          })
        }
      }
      return list
    },
    filteredNums(n) {
      let nums = 0
      console.log(this.filterForm, 'filteredNums')
      if (n) {
        for (let key in this.filterForm) {
          if (
            this.filterForm[key] != '' &&
            key != 'createBy' &&
            this.filterForm[key] != null &&
            this.filterForm[key] != undefined
          ) {
            nums += 1
          }
        }
      } else {
        for (let key in this.filterForm) {
          if (this.filterForm[key] != '' && this.filterForm[key] != null && this.filterForm[key] != undefined) {
            nums += 1
          }
        }
      }
      return nums
    },
  },
  created() {
    let user = localStorage.getItem('pro__Login_Userinfo')
    this.loginUser = JSON.parse(user).value.id
    this.initData()
    this.requestData()
  },
  mounted() {
    console.log('filteredNums:', this.filteredNums)
  },
  methods: {
    /* 进度条颜色 */
    checkStatus(value) {
      if (value == 0) {
        return '#DFDFDF'
      } else if (value >= 100) {
        return '#4bd863'
      } else {
        return '#1890ff'
      }
    },
    // table
    // 排序
    handleChange(pagination, filters, sorter, { currentDataSource }) {
      console.log('看看这是啥33：', sorter)
      if (sorter.order) {
        let sortType = ''
        if (sorter.order == 'ascend') {
          sortType = 'ASC'
        } else {
          sortType = 'DESC'
        }
        this.sortForm = {
          sortType: sortType,
          sortColumn: camelCase2UnderLine(sorter.columnKey),
        }
        this.requestData()
      } else {
        this.sortForm = {
          sortType: '',
          sortColumn: '',
        }
        this.requestData()
      }
    },
    // table选择
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.checkBoxStatus()
    },
    // 全选
    onCheckAllChange(e) {
      if (e.target.checked) {
        for (let item of this.modelList) {
          this.selectedRowKeys = this.selectedRowKeys.filter((each) => {
            return each != item.id
          })
          this.selectedRowKeys.push(item.id)
        }
      } else {
        for (let item of this.modelList) {
          this.selectedRowKeys = this.selectedRowKeys.filter((each) => {
            return each != item.id
          })
        }
      }
      this.checkBoxStatus()
    },
    // 清空
    clearArr() {
      this.selectedRowKeys = []
      this.checkBoxStatus()
    },
    checkBoxStatus() {
      if (this.selectedRowKeys.length == 0) {
        this.listIndeterminate = false
        this.listCheckAll = false
      } else {
        let tableIds = []
        for (let item of this.modelList) {
          tableIds.push(item.id)
        }
        let checkValue = this.isInclude(tableIds, this.selectedRowKeys)
        if (checkValue) {
          this.listIndeterminate = false
          this.listCheckAll = true
        } else {
          this.listIndeterminate = true
          this.listCheckAll = false
        }
      }
    },
    isInclude(aa, bb) {
      return aa.every((item) => {
        return bb.some((sub) => {
          return sub === item
        })
      })
    },
    setColor(s) {
      console.log(s, 'ssssssssssssssss')
      let cor = {
        1: '#888888',
        2: '#1890FF',
        3: '#00B042',
      }
      return cor[s] || ''
    },
    checkColor(value) {
      if (value == 0) {
        return '#DFDFDF'
      } else if (value >= 100) {
        return '#00B042'
      } else {
        return '#1890FF'
      }
    },
    // 列头检索提示语
    checkPlaceholder(dataIndex) {
      console.log(dataIndex, 'dataIndex')
      let str = ''
      switch (dataIndex) {
        case 'applyNo':
          str = '请输入申请编号'
          break
        case 'inStockStatus':
          str = '请选择入库状态'
          break
        case 'applyTime':
          str = '请选择时间'
          break
        case 'applicantId':
          str = '请选择提交人'
          break
      }
      return str
    },
    // 提交时间
    endTimeChange(a, b) {
      if (!b[0] && !b[1]) {
        this.modelEndTime = []
        this.filterForm.planEndTime = null
      } else {
        this.filterForm.planEndTime = b
      }
    },
    // 选人 提交人
    userCreate(storeVals, row) {
      this.filterForm.applicantId = ''
      let newArr = []
      let arrTwo = []
      for (let item of row) {
        newArr.push(item.id)
        arrTwo.push(item.realname)
      }
      if (newArr.length > 0) {
        this.filterForm.applicantId = newArr.join(',')
      }
      if (arrTwo.length > 0) {
        this.showCreateStr = arrTwo.join(',')
      }
      this.requestData()
    },
    // 选人 提交人 筛选
    createChange(storeVals, row) {
      this.filterForm.applicantId = ''
      let newArr = []
      let arrTwo = []
      for (let item of row) {
        newArr.push(item.id)
        arrTwo.push(item.realname)
      }
      if (newArr.length > 0) {
        this.filterForm.applicantId = newArr.join(',')
      }
      if (arrTwo.length > 0) {
        this.showCreateStr = arrTwo.join(',')
      }
    },
    // 分页
    onChangePage(current, pageSize) {
      this.current = current
      this.pageSize = pageSize
      this.requestData()
    },
    onShowSizeChange(current, pageSize) {
      this.current = current
      this.pageSize = pageSize
      this.requestData()
    },
    handleSearch(selectedKeys, confirm, dataIndex, clearFilters) {
      // confirm() //用来关闭搜索弹窗
      // clearFilters() //用来重置搜索内容
      // console.log('这都是啥00：', selectedKeys)
      // console.log('这都是啥11：', confirm)
      // console.log('这都是啥22：', dataIndex)
      // console.log('这都是啥33：', clearFilters)
      this.requestData()
    },
    /* 打开筛选 */
    handleShowFilter() {
      this.showFilter = true
    },
    /* 关闭筛选 */
    closeFilter() {
      this.showFilter = false
    },
    /* 确定筛选 */
    handleFilter() {
      this.requestData()
      this.showFilter = false
    },
    /* 删除已选 */
    delFiltered(key) {
      if (this.filteredFormLable[key] == '提交人') {
        this.createStr = ''
        this.showCreateStr = ''
        this.filterForm[key] = ''
      } else if (this.filteredFormLable[key] == '提交时间') {
        this.modelEndTime = []
        this.filterForm[key] = null
      } else if (this.filteredFormLable[key] == '入库状态') {
        this.filterForm[key] = undefined
      } else {
        this.filterForm[key] = ''
      }
    },
    /* 重置筛选 */
    resetFilter() {
      this.filterForm = {
        applyNo: '', //申请编号
        inStockStatus: undefined, //入库状态
        planEndTime: null, //提交时间
        applicantId: '', //提交人
      }
      this.createStr = '' //筛选-提交人
      this.showCreateStr = '' //筛选-提交人
      this.modelEndTime = [] //提交时间
      this.showFilter = false
      this.requestData()
    },
    /* 初始/加载设置列 */
    initData() {
      var oldValue = localStorage.getItem(this.BUSI_CONST.Entity.RETURN_MATERIAL_LIST)
      this.columns = getNewColumns(this.columnsValue, JSON.parse(oldValue), actionArr, 150)
      getEnableOne({ id: 'MESS_RETURN_MATERIAL_APPLY', type: 'add' }).then((res) => {
        if (res.result && res.result == 'false') {
          this.columnsValue = this.columnsValue.filter((item) => item.title != '审核状态')
          this.columns = this.columns.filter((item) => item.title != '审核状态')
        }
      })
    },
    /* 请求列表数据 */
    requestData() {
      let applyTimeBegin = null
      let applyTimeEnd = null
      console.log(this.filterForm.planEndTime, 'this.filterForm.planEndTime')
      if (this.filterForm.planEndTime && this.filterForm.planEndTime.length > 0) {
        applyTimeBegin = this.filterForm.planEndTime[0]
        applyTimeEnd = this.filterForm.planEndTime[1]
      }
      let inStockStatus = undefined
      if (this.filterForm.inStockStatus && this.filterForm.inStockStatus.length > 0) {
        inStockStatus = this.filterForm.inStockStatus.join(',')
      }
      let parameter = {
        inStockStatus: inStockStatus,
        applyTimeBegin: applyTimeBegin,
        applyTimeEnd: applyTimeEnd,
        applyNo: this.filterForm.applyNo,
        applicantId: this.filterForm.applicantId,
        pageNo: this.current,
        pageSize: this.pageSize,
        // ...this.filterForm,
        ...this.sortForm,
      }
      console.log(parameter, 'parameter')
      returnMaterialApplyList(parameter).then((res) => {
        if (res.code == 200) {
          if (res.result.total) {
            this.total = res.result.total
          } else {
            this.total = 0
          }
          this.modelList = res.result.records
          // this.modelList.forEach(record => {
          // })
        }
      })
    },
    /* 打开设置列面板 */
    showColumn() {
      this.showSetColumn = true
      this.$nextTick(() => {
        this.$refs.SetColumn.paramsData(this.columnsValue, this.BUSI_CONST.Entity.RETURN_MATERIAL_LIST, this.columns)
      })
    },
    /* 设置列 */
    sureBtn(emitArr) {
      this.columns = getNewColumns(this.columnsValue, emitArr, actionArr, 150)
      console.log(this.columns)
      localStorage.setItem(this.BUSI_CONST.Entity.RETURN_MATERIAL_LIST, JSON.stringify(emitArr))
    },
    /* 导入 */
    importFile() {},
    /* 导出 */
    exportFile() {},
    /* 新建 */
    handleAdd() {
      // this.$router.push('/inspectionProgramForm')
      this.$openWay(this, false, '/inspectionProgramForm')
    },
    /* 详情 */
    handleDetail(v) {
      // this.$router.push({
      //   path: '/workManagement/returnMaterial/returnMaterialDetail',
      //   query: { id: v.id },
      // })
      this.$openWay(this, false, '/inspectionProgramDetail', { id: v.id })
    },
    /* 撤回 */
    handleWithdraw(v) {
      let that = this
      that.$antdConfirm({
        title: '确定撤回吗？',
        content: '撤回后暂不支持再次发起',
        onOk() {
          API.operateRevoke({ flowInstId: v.flowInstId }).then((res) => {
            if (res.code == 200) {
              that.$antdMessage.success(res.message)
              that.requestData()
            } else {
              that.$antdMessage.error(res.message)
            }
          })
        },
        onCancel() {},
      })
    },
    statusColor(v) {
      let obj = {
        RUNNING: '#1890FF',
        REFUSE: '#FF4D4F',
        TERMINATED: '#888888',
        AGREE: '#00B042',
      }
      return obj[v] || ''
    },
    /* 删除 */
    handleDelete(v) {
      let that = this
      that.$antdConfirm({
        title: '请确定要删除此申请吗?',
        content: ``,
        onOk() {
          returnMaterialDelete({ id: v.id }).then((res) => {
            if (res.code == 200) {
              that.$antdMessage.success('退料申请删除成功！')
              that.requestData()
            }
          })
        },
        onCancel() {},
      })
    },
    //点击返回按钮
    goBack() {
      console.log('goback')
    },
  },
}
</script>
<style scoped lang="less">
@import '~@/assets/less/public.less';
.flex(@jc,@ai,@fd:row) {
  display: flex;
  justify-content: @jc;
  align-items: @ai;
  flex-direction: @fd;
}
.header {
  width: 150%;
  margin: -12px -12px @distance4;
}
.backBox {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  .backC {
    cursor: pointer;
    display: flex;
    align-items: center;
  }
}
.j-table-force-nowrap {
  margin-top: @distance1;
}
.btns {
  margin-left: @distance5;
}
.right-btn {
  float: right;
  display: flex;
  justify-content: flex-end;
}
.mg-left {
  margin-left: @distance3;
}
.filter-tit {
  background: #fff;
  border-bottom: 1px solid @greyBorder;
  font-size: @fontSize4;
}
.filter-num {
  color: @normalFont;
}
.filter-body {
  height: 100vh;
  display: flex;
  flex-direction: column;
}
.margin-btn {
  margin-right: @distance5;
}
.filter-tag {
  display: inline-block;
  position: relative;
  padding: 8px 10px;
  border-radius: 4px;
  font-size: @fontSize1;
  line-height: @fontSize1;
  max-width: 100%;
  background: @greyBg;
  color: @titFont;
  cursor: pointer;
  .tag-text {
    display: inline-block;
    padding-right: 20px;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .anticon-close {
    position: absolute;
    right: 8px;
    top: 8px;
  }
}
.tag-wrap:nth-of-type(n + 2) {
  margin-top: 10px;
}
.searchWorkOreder {
  .flex(flex-start, center);
  padding: 8px;
}
/deep/ .ant-card-body {
  height: calc(100vh - 214px);
  overflow: hidden;
  padding: 20px 16px;
}
.pubColor {
  font-size: 14px;
  color: #1890ff;
  cursor: pointer;
}
</style>
